<template>
	<view class="p-20">
		<view v-if="hierarchy">
			<template v-if="flag">
				<view class="flex align-center justify-center mb-10">
					<text class="font-weight-bold">{{ firstTitle }}</text>
				</view>
				<view class="font">
					<slot name="firstInfo"></slot>
				</view>
				<view class="mt-20">
					<uv-button :disabled="nextFlag1" @click="nextClick" v-if="businessCode == 'R'">
						<template #default>
							<uv-count-down :time="20000" format="ss" @change="onChange1">
								<view class="time">
									<text
										class="time__item">{{ timeData1.seconds > 0 ? '下一页（' + timeData1.seconds + 's)' : '下一页' }}</text>
								</view>
							</uv-count-down>
						</template>
					</uv-button>
					<uv-button :disabled="nextFlag1" @click="nextClick" v-else-if="businessCode == 'C'">
						<template #default>
							<uv-count-down :time="20000" format="ss" @change="onChange1">
								<view class="time">
									<text
										class="time__item">{{ timeData1.seconds > 0 ? '我已阅读并同意以上内容（' + timeData1.seconds + 's)' : '我已阅读并同意以上内容' }}</text>
								</view>
							</uv-count-down>
						</template>
					</uv-button>
					<uv-button :text="firstBtnText" @click="nextClick" v-else></uv-button>
				</view>

			</template>
			<template v-else>
				<view class="flex align-center justify-center mb-10">
					<text class="font-weight-bold">{{ secondTitle }}</text>
				</view>
				<view class="font">
					<slot name="secondInfo"></slot>
				</view>
				<view class="mt-20">
					<uv-checkbox-group v-model="checked">
						<uv-checkbox name="isAgree" :label="`我已阅读并同意以上内容`"></uv-checkbox>
					</uv-checkbox-group>
				</view>
				<view class="mt-20">
					<uv-button :disabled="nextFlag" @click="reportFilling" v-if="seconds" type="primary">
						<template #default>
							<uv-count-down :time="20000" format="ss" @change="onChange">
								<view class="time">
									<text
										class="time__item">{{ timeData.seconds > 0 ? `${secondBtnText}（${timeData.seconds}s)` : secondBtnText }}</text>
								</view>
							</uv-count-down>
						</template>
					</uv-button>
					<uv-button v-else type="primary" :text="secondBtnText" @click="reportFilling"></uv-button>
				</view>
			</template>
		</view>
		<view v-else>
			<view class="flex align-center justify-center mb-10">
				<text class="font-weight-bold">{{ secondTitle }}</text>
			</view>
			<view class="font">
				<slot name="secondInfo"></slot>
			</view>
			<view class="mt-20">
				<uv-checkbox-group v-model="checked">
					<uv-checkbox name="isAgree" label="我已阅读并同意以上内容"></uv-checkbox>
				</uv-checkbox-group>
			</view>
			<view class="mt-20">
				<uv-button :disabled="nextFlag" @click="reportFilling" v-if="seconds" type="primary">
					<template #default>
						<uv-count-down :time="20000" format="ss" @change="onChange">
							<view class="time">
								<text
									class="time__item">{{ timeData.seconds > 0 ? `${secondBtnText}（${timeData.seconds}s)` : secondBtnText }}</text>
							</view>
						</uv-count-down>
					</template>
				</uv-button>
				<uv-button v-else type="primary" :text="secondBtnText" @click="reportFilling"></uv-button>
			</view>
		</view>
	</view>
</template>

<script>
	import tip from '@/common/util/tip.js';
	export default {
		name: 'Tip',
		props: {
			firstTitle: {
				type: String,
				default: ''
			},
			secondTitle: {
				type: String,
				default: ''
			},
			firstBtnText: {
				type: String,
				default: ''
			},
			secondBtnText: {
				type: String,
				default: '举报填写'
			},
			businessCode: {
				type: String,
				default: 'R'
			},
			hierarchy: {
				type: Boolean,
				default: true
			},
			seconds: {
				type: Number,
				default: 0
			}
		},
		data() {
			return {
				flag: true,
				nextFlag: true,
				nextFlag1: true,
				timeData: {},
				timeData1: {},
				checked: []
			};
		},
		methods: {
			onChange1(e) {
				this.timeData1 = e;
				if (this.timeData1.seconds <= 0) {
					this.nextFlag1 = false;
				}
			},
			onChange(e) {
				this.timeData = e;
				if (this.timeData.seconds <= 0) {
					this.nextFlag = false;
				}
			},
			nextClick() {
				this.flag = false;
			},
			reportFilling() {
				if (this.checked.length == 0) {
					return tip.toast('请点击我已阅读');
				}
				console.log('999999');
				this.$emit('ok');
			}
		}
	};
</script>

<style scoped></style>